import { createApp } from 'vue';
import router from '@/router/index';
import highlight from 'highlight.js'; // 导入代码高亮文件
import App from './App.vue';
import './assets/style/common.scss';
import { addRouterByFolder, getStorage } from './assets/js/utils';
import 'highlight.js/styles/a11y-light.css'; // 导入代码高亮样式

// 使用views下的文件夹构建router
addRouterByFolder();
const Vue = createApp(App);
Vue.use(router).mount('#app');
const theme = getStorage('theme');
document.documentElement.setAttribute('theme', theme);

// /自定义一个代码高亮指令
Vue.directive('highlight', (el) => {
  const dom = el.querySelector('pre');
  if (dom && !dom.classList.contains('hljs')) {
    if (dom.dataset.type) {
      dom.classList.add(`language-${dom.dataset.type}`);
    }
    dom.classList.add('learning-pre');
    highlight.highlightElement(dom);
  }
});
